<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">

<body>
<div th:fragment="menu">
    <style>
        .menu-title {
            display: flex;
            justify-content: center;
            align-items: center;
            color: #FFFFFF;
        }

        .menu-title .title-line {
            flex: 1;
            border-bottom: #FFFFFF 1px solid;
        }

        .menu-title .title-body {
            margin: 0 15px;
        }

        .left-input {
            background-color: unset;
            width: 90%;
            margin: 0 auto;
            color: #FFFFFF;
        }
    </style>
    <div id="sidebar">
        <div class="menu-wrap" style="display:none;">
            <nav class="menu">
                <div class="menu-introduce">
                    <div class="introduce-avatar">
                        <img src='https://file.liujit.com/blog/avatar.jpg'>
                    </div>
                    <div class="introduce-info">
                        <div class="introduce-user">
                            <span>liujun</span>
                        </div>
                        <div class="introduce-user">
                            <span>择一事，终一生，做一个纯粹的软件攻城狮。</span>
                        </div>
                        <div class="introduce-user">
                            <span><a href="https://gitee.com/liujit">https://gitee.com/liujit</a></span>
                        </div>
                    </div>
                </div>


                <div class="menu-list">
                    <!--此时-->
                    <div th:replace="~{common/today :: today}"></div>
                    <ul>
                        <li>
                            <a href="/">首页</a>
                        </li>
                        <li>
                            <a href="/blog/label">标签</a>
                        </li>
                        <li>
                            <a href="/blog/category">分类</a>
                        </li>
                        <li>
                            <a href="/blog/archive">归档</a>
                        </li>
                        <li>
                            <a href="/blog/about">关于</a>
                        </li>
                        <li>
                            <a href="/blog/friend">友情链接</a>
                        </li>
                    </ul>
                </div>
                <!--日历-->
                <div th:replace="~{common/menuDate :: date}"></div>
                <!--搜搜看-->
                <div class="menu-title">
                    <div class="title-line"></div>
                    <div class="title-body">找找看</div>
                    <div class="title-line"></div>
                </div>
                <input type="text" onkeydown="search(this)" autocomplete="off" class="left-input layui-input">
            </nav>
            <button class="menu-button-close"></button>
            <div class="morph-shape" id="morph-shape"
                 data-morph-open="M-7.312,0H15c0,0,66,113.339,66,399.5C81,664.006,15,800,15,800H-7.312V0z;M-7.312,0H100c0,0,0,113.839,0,400c0,264.506,0,400,0,400H-7.312V0z">
                <svg xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" viewBox="0 0 100 800"
                     preserveAspectRatio="none">
                    <path d="M-7.312,0H0c0,0,0,113.839,0,400c0,264.506,0,400,0,400h-7.312V0z"/>
                </svg>
            </div>
        </div>
        <button class="menu-button-open">MENU</button>
        <div class="menu-cover"></div>
    </div>
    <script>
        function search(t) {
            const e = window.event;
            if (e.keyCode == 13) {
                window.location.href="/?title=" + t.value
            }
        }
    </script>
</div>
</body>
</html>